<html lang="cn">

<head>
    <meta charset="UTF-8">
    <meta name="format-detection" content="telephone = no">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
  <title></title>
  <link rel="stylesheet" href="./hotList.css">
  <link rel="stylesheet" href="../common.css">
  <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
  <script src="../common.js"></script>
  <script type="text/javascript" src="../paging.js"></script>
</head>

<body>
  
  <div class="container">
    <div class="navContainer" >
      <div class="navContent">
        <div class="logo">
          <img src="../images/logo.png">
        </div>
        <ul class="list">
          <li>首页</li>
          <li>热门榜单</li>
          <li>品牌视界</li>
          <li>中企头条</li>
          <li>中企荣誉墙</li>
        </ul>
        <div class="button">参加活动</div>
      </div>
    </div>
    <div class="topImage">
      <div class="topTitle">数据挖掘价值  /  诚信铸造品牌</div>
      <div class="searchGroup">
        <input type="text" class="searching">
        <div class="searchingButton">搜索</div>
      </div>
    </div>
    <div class="content">
      <div class="showContainer">
        <div class="nav">
          <div class="wrapperTopRedLine"></div>
          <div class="wrapperTitle">热门榜单</div>
        </div>
        <ul class="showContent">
          <li>
            <img src="../images/hotList/rmbd_dw_img.png" class="bg1">
            <img src="../images/hotList/rmbd_dwdj_img.png" class="bg2">
            <div class="title">2019年十大品牌荣誉榜单</div>
            <div class="industry needEllipsis">数字式电子汽车衡行业1</div>
            <div class="date">
              <p class="day">06</p>
              <div class="line">&nbsp;</div>
              <p class="month">2019.06</p>
            </div>
          </li>
          <li>
            <img src="../images/hotList/rmbd_dw_img.png" class="bg1">
            <img src="../images/hotList/rmbd_dwdj_img.png" class="bg2">
            <div class="title">2019年十大品牌荣誉榜单</div>
            <div class="industry needEllipsis">数字式电子汽车衡行业2</div>
            <div class="date">
              <p class="day">06</p>
              <div class="line">&nbsp;</div>
              <p class="month">2019.06</p>
            </div>
          </li>
          <li>
            <img src="../images/hotList/rmbd_dw_img.png" class="bg1">
            <img src="../images/hotList/rmbd_dwdj_img.png" class="bg2">
            <div class="title">2019年十大品牌荣誉榜单</div>
            <div class="industry needEllipsis">数字式电子汽车衡行业2</div>
            <div class="date">
              <p class="day">06</p>
              <div class="line">&nbsp;</div>
              <p class="month">2019.06</p>
            </div>
          </li>
          <li>
            <img src="../images/hotList/rmbd_dw_img.png" class="bg1">
            <img src="../images/hotList/rmbd_dwdj_img.png" class="bg2">
            <div class="title">2019年十大品牌荣誉榜单</div>
            <div class="industry needEllipsis">数字式电子汽车衡行业3</div>
            <div class="date">
              <p class="day">06</p>
              <div class="line">&nbsp;</div>
              <p class="month">2019.06</p>
            </div>
          </li>
          <li>
            <img src="../images/hotList/rmbd_dw_img.png" class="bg1">
            <img src="../images/hotList/rmbd_dwdj_img.png" class="bg2">
            <div class="title">2019年十大品牌荣誉榜单</div>
            <div class="industry needEllipsis">数字式电子汽车衡行业3</div>
            <div class="date">
              <p class="day">06</p>
              <div class="line">&nbsp;</div>
              <p class="month">2019.06</p>
            </div>
          </li>
          <li>
            <img src="../images/hotList/rmbd_dw_img.png" class="bg1">
            <img src="../images/hotList/rmbd_dwdj_img.png" class="bg2">
            <div class="title">2019年十大品牌荣誉榜单</div>
            <div class="industry needEllipsis">数字式电子汽车衡行业3数字式电子汽车衡行业3</div>
            <div class="date">
              <p class="day">06</p>
              <div class="line">&nbsp;</div>
              <p class="month">2019.06</p>
            </div>
          </li>
          <li>
            <img src="../images/hotList/rmbd_dw_img.png" class="bg1">
            <img src="../images/hotList/rmbd_dwdj_img.png" class="bg2">
            <div class="title">2019年十大品牌荣誉榜单</div>
            <div class="industry needEllipsis">数字式电子汽车衡行业3</div>
            <div class="date">
              <p class="day">06</p>
              <div class="line">&nbsp;</div>
              <p class="month">2019.06</p>
            </div>
          </li>
        </ul>
        <div id="page" class="page_div" style="margin: auto;margin-bottom: 50px;"></div>
      </div>
    </div>
    <div class="bottomContainer">
      <div class="bottomContent">
        <div class="left">
          <p class="title">友情链接</p>
          <ul class="row">
            <li class="cell"><a>新华网</a></li>
            <li class="cell"><a>新华网</a></li>
            <li class="cell"><a>新华网</a></li>
          </ul>
          <ul class="row">
            <li class="cell"><a>国家统计局</a></li>
            <li class="cell"><a>新华网</a></li>
            <li class="cell"><a>新华网</a></li>
          </ul>
        </div>
        <div class="center">
          <p class="title">联系我们</p>
          <p class="phone">客服电话</p>
          <p class="phoneNumber">400-159-0958</p>
          <p class="email">邮箱</p>
          <p class="emailAddress">kefu@10pinpaiwang.com</p>
        </div>
        <div class="right">
          <div class="code">
            <div><img src="" alt="" srcset="" ></div>
            <p class="small">中信网M端 <br> 扫码立即打开1</p>
          </div>
          <div class="code">
            <div><img src="" alt="" srcset="" ></div>
            <p class="small">中企公众号 <br> 扫码立即关注</p>
          </div>
        </div>
      </div>
      <p class="bottomRecord">Copyright 中企品牌网(www.brandzw.com) 京ICP备19006167号-1</p>
    </div>
  </div>
</body>
</html>

<script>

  var brandWorldInit = {
    searching: function () {
      var currentShowCell = []
      var sort = function (value) {
        currentShowCell = []
        var surplusRanking = $('.showContent li')
        for (var i = 0; i < surplusRanking.length; i++) {
          +function (i) {
            var arr = []
            console.log($(surplusRanking[i]).find('.industry'))
            for (var j = 0; j < $(surplusRanking[i]).find('.industry').length; j++) {
              +function (j) {
                console.log($($(surplusRanking[i]).find('.industry')).text())
                arr.push($($(surplusRanking[i]).find('.industry')).text())
              }(j)
            }
            if (arr.toString().indexOf(value) != '-1') {
              currentShowCell.push(surplusRanking[i])
              surplusRanking[i].style.display = 'flex'
            } else {
              surplusRanking[i].style.display = 'none'
            }
          }(i)
        }
        for(var i in currentShowCell) {
          if ((+i + 1) % 3 == 0) $(currentShowCell[i]).css('marginRight', '0')
          else $(currentShowCell[i]).css('marginRight', '28px')
        }
      }
      var searchTimer
      $('.searching').on('input', function (e) {
        if (searchTimer) clearTimeout(searchTimer)
        searchTimer = setTimeout(function () {
          sort(e.delegateTarget.value)
        }, 133)
      })
      $('.searchingButton').click(function () {
        console.log($('.searching').val())
        sort($('.searching').val())
      })
    },
    page:function() {
      $("#page").paging({
        pageNo:5,
        totalPage: 9,
        // totalSize: 300,
        callback: function(num) {
          // alert(num)
        }
      })
    }
  }
  $(document).ready(function () {

    for (var i in brandWorldInit) {
      brandWorldInit[i]()
    }
  })
</script>
